<template>
    <div class="login-form">
        <div class="form-group iconCell">
            <label>
                账号
            </label>
            <input type="text" placeholder="账户/工号" autocomplete="off" v-model="account" @keyup="isLogin"/>
            <div class="iconfont">
                <i class="iconfont icon-xiala"></i>
            </div>
        </div>
        <div class="form-group iconCell">
            <label>
                密码
            </label>
            <input type="text" placeholder="密码" autocomplete="off" v-model="password" v-if="isShow" disabled/>
            <input type="password" placeholder="密码" autocomplete="off" v-model="password" v-if="isHide"
                   @keyup="isLogin"/>
            <div class="iconfont">
                <i class="icon-kejian" @click="showPassword"></i>
            </div>
        </div>
        <div class="btn" @click="login" v-bind:class="{active:loginActive}">
            登录
        </div>
    </div>
</template>
<script>

    import {mapState} from "vuex"
    import local from "../../util/local"
    export default{
        name: 'generalLogin',
        data: function () {
            return {
                account: '',
                password: '',
                loginActive: false,
                isShow: false,
                isHide: true
            }
        },
        methods: {
            isLogin(){
                if (this.account && this.password) {
                    this.loginActive = true;
                }
            },
            showPassword(){
                if (!this.loginActive)return;
                this.isShow = !this.isShow;
                this.isHide = !this.isHide;
            },
            login(){
                var self = this;
                this.$store.dispatch({
                    type: "loginIn",
                    name: this.account,
                    password: this.password
                }).then(function (res) {
                    self.onSuccess(res);
                }, function (err) {

                })
            },
            onSuccess: function (res) {
                this.$store.commit({type: 'resetParam'})
                if(res.must_update_role=='1'){
                    this.$router.push("/selectRole")
                }else {
                    this.$router.push("/order")
                }
            },
            onError: function (err) {

            }

        },
        computed: mapState({}),
        created(){
            if (local.get('username') && local.get('must_update_role')=='0') {
                this.$router.push("/order")
            }
        }
    }
</script>

